import 'package:flutter/material.dart';
import 'package:lottie/lottie.dart';
import 'package:ui_demo/custom_webp/test.dart';
import 'package:ui_demo/custom_webp/test2.dart';

import '../util/print_util.dart';
import 'gif_image.dart';

// class CustomWebpPage extends StatefulWidget {
//   const CustomWebpPage({super.key});
//
//   @override
//   State<CustomWebpPage> createState() => _CustomWebpPageState();
// }
//
// class _CustomWebpPageState extends State<CustomWebpPage> {
//   @override
//   Widget build(BuildContext context) {
//     return Image.asset("assets/svg/cast.webp");
//   }
// }

class GifPlayerDemo extends StatefulWidget {
  const GifPlayerDemo({super.key});

  @override
  State<GifPlayerDemo> createState() => _GifPlayerDemoState();
}

class _GifPlayerDemoState extends State<GifPlayerDemo>
    with SingleTickerProviderStateMixin, WidgetsBindingObserver {
  bool isLoaded = false; // 标记Widget是否加载完成的变量
  static const _sTag = "_GifPlayerDemoState";
  String picRes1 =
      "https://ts1.cn.mm.bing.net/th/id/R-C.3562db2b97df44ad0a2913367e923bc9?rik=F0gPEgEKbhChlw&riu=http%3a%2f%2fpic.962.net%2fup%2f2016-10%2f14760807179493223.gif&ehk=1QnaRGwQ3oUxW2TtYQHyQM5fm9qkakLLshGCLtGyzE0%3d&risl=&pid=ImgRaw&r=0";
  int repetitionCount = 1;
  Duration? duration = const Duration(seconds: 3);
  late CustomAssetImage gifNetworkImage;
  late GifController controller;

  @override
  void initState() {
    gifNetworkImage = CustomAssetImage("assets/svg/network_sharing.webp");
    controller =
        GifController(vsync: this, duration: const Duration(milliseconds: 300));

    // / 添加观察者
    WidgetsBinding.instance.addObserver(this);

    // 注册post-frame回调函数
    WidgetsBinding.instance.addPostFrameCallback((_) {
      setState(() {
        isLoaded = true; // 设置isLoaded为true表示Widget已加载完成
      });
    });
    super.initState();
  }

  @override
  void dispose() {
    // 移除观察者
    WidgetsBinding.instance!.removeObserver(this);

    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MouseRegion(
        onEnter: (event) {
          LogUtils.d(_sTag, "onEnter frameCount");

          if (isLoaded) {
            controller.repeat(
                min: 0, max: 78, period: const Duration(milliseconds: 1500));
          }
          if (mounted) {
            setState(() {
              if (isLoaded) {
                controller.repeat(
                    min: 0,
                    max:116,
                    period: const Duration(milliseconds: 1500));
              }
            });
          }
        },
        onExit: (event) {
          LogUtils.d(_sTag, "onExit ");
          if (mounted) {
            setState(() {
              if (isLoaded) {
                controller.animateTo(116,
                    duration: const Duration(milliseconds: 1500));
              }
              // Future.delayed(Duration(milliseconds: 3000), () {
              //
              // });
            });
          }
        },
        child: Column(
          children: <Widget>[
            SizedBox(
                width: 400,
                height: 400,
                child:
                Lottie.asset("assets/lottie/function_transfer/data.json", repeat: true)
                // GifImage(
                //   controller: controller,
                //   image: const AssetImage("assets/svg/network_sharing.webp"),
                // )
                // child:WebpImage.Webp(image: gifNetworkImage),
                ),
            Row(
              children: <Widget>[
//                 FilledButton(
//                   child: const Text("startPlay"),
//                   onPressed: () {
//                     // repetitionCount = -1;
//                     // duration = null;
//                     // gifNetworkImage.startPlay();
//                     // loop from 0 frame to 29 frame
//                     controller.repeat(
//                         min: 0,
//                         max: 78,
//                         period: const Duration(milliseconds: 3000));
//
// // // jumpTo thrid frame(index from 0)
// //                 controller.value = 0;
// //
// // // from current frame to 26 frame
// //                 controller.animateTo(26);
//
//                     setState(() {});
//                   },
//                 ),
//                 FilledButton(
//                   child: Text("stopPlay"),
//                   onPressed: () {
//                     // gifNetworkImage.stopPlay();
//                     // repetitionCount = 1;
//                     // duration = const Duration(seconds: 3);
//                     // gifNetworkImage.updatePlayConfig(
//                     //   repetitionCount: repetitionCount,
//                     //   replayDuration: duration,
//                     // );
//                     controller.animateTo(78,
//                         duration: const Duration(milliseconds: 3000));
//                     setState(() {});
//                   },
//                 )
              ],
            ),
          ],
        ));
  }
}
